<script lang="ts">
export default {
  name: 'settlementFrom',
  description: '用工订单结算',
};
</script>

<script setup lang="ts">
import { ElForm, ElMessage, ElMessageBox } from 'element-plus';
import selectEngineer from '@/views/order/components/selectEngineer.vue';
import { invitationalevision} from '@/api/system/examineRecord/index';
import {
  OrderQuery,
  Settlement,
  OrderForm,
  SettlementForm,
} from '@/api/order/types';
import {} from '@element-plus/icons-vue';
import { settlementSubmission, payOrder } from '@/api/order/index';
import { casualCheckRecordAdd,casualCheckRecordExamine,casualCheckRecordRejectReview } from '@/api/system/examineRecord/index';
import { ExamineRecord } from '@/api/system/examineRecord/types';
import { nextTick, onMounted, reactive, toRefs ,ref} from 'vue';
const emit = defineEmits(['submitOk']);
const state = reactive({
  dialog: {
    title: '',
    visible: false,
  } as DialogType,
  form: {} as SettlementForm,
  formData: {} as OrderForm,
  dataList: [] as Settlement[],
  dataLoading: false,
  dataTotal: 0,
  //判断是不是审核页面
  ifexamine:false,
  examineRow:{} as ExamineRecord,
  selectRow:{} as any
});
const {
  dialog,
  form,
  dataList,
  dataLoading,
  dataTotal,
  formData,
  ifexamine,
  examineRow,
  selectRow
} = toRefs(state);

defineExpose({
  dialog,
  formData,
  ifexamine,
  examineRow,
  reset,
});
const refEngineer = ref();
//重载
function reset(row: any) {
  selectRow.value = row;
  dataLoading.value = true;
  let params = {
    pageNum: 1,
    pageSize: 10,
  };
  dataList.value = [];
  dataTotal.value = 0;
  if (!formData.value.id) return;
  settlementSubmission(formData.value.id).then((res: any) => {
  nextTick(() => {
    state.dataList = res.data.casualOrderPaymentRecordItems;
    state.form =  res.data
    getFrom();
    dataLoading.value = false;
  })
  });
}
function selectPeople(row: any) {
  refEngineer.value.dialog.visible = true;
  refEngineer.value.formData = row;
  refEngineer.value.canAdd = false;
  refEngineer.value.dialog.title = '选择邀请人';
}
function handleChange() {
  getFrom();
}
function getFrom() {
  state.form.settlementMoney = state.dataList
    .map((el: any) => el.settlementMoney-0)
    .reduce((t: number, v: number) => t + v, 0);
}
//确定
function submitForm(b: boolean) {
  state.form.id = state.formData.id
  state.form.casualOrderPaymentRecordItems = state.dataList;
  payOrder(state.form).then(() => {
    ElMessage.success('结算成功');
    if (b) submitExamineRecord();
    if (!b) dialog.value.visible = false,emit('submitOk')
  });
}
function submitExamineRecord() {
  ElMessageBox.prompt('备注', '提交审核', {
		confirmButtonText: '确定',
		showCancelButton:false,
		showClose:false,
    inputType: 'textarea',
    inputErrorMessage: '请输入备注',
  }).then(({ value }) => {
    let param = {
      businessId: state.formData.id as number,
      businessType: '1',
      remark: value as string,
    };

    casualCheckRecordAdd(param).then((res) => {
      ElMessage.success('提交审核成功');
      dialog.value.visible = false;
      emit('submitOk')
    });
  });
}
//取消
function cancel() {
  dialog.value.visible = false;
}
function through(){
  ElMessageBox.prompt('备注', '同意审核', {
		confirmButtonText: '确定',
		showCancelButton:false,
		showClose:false,
    inputType: 'textarea',
    inputErrorMessage: '请输入备注',
  }).then(({ value }) => {
    let param = {
      businessId: state.formData.id as number,
      businessType: '1',
      id:state.examineRow.id,
      remark: value as string,
    };
    casualCheckRecordExamine(param).then((res) => {
     ElMessage.success('同意审核成功');
     dialog.value.visible = false;
     emit('submitOk')
    });
  });
}
function submitOk(parma:any) {
  console.log(parma);
  invitationalevision({engineerId:parma.order_id,yqEngineerId:parma.engineer_ids}).then((res:any)=>{
    if (res.code == '00000') {
      ElMessage.success(res.data)
      refEngineer.value.dialog.visible = false;
      reset(null)
    }else{
      ElMessage.error(res.data)
    }
  })
}
function reject(){
  ElMessageBox.prompt('备注', '驳回审核', {
		confirmButtonText: '确定',
		showCancelButton:false,
		showClose:false,
    inputType: 'textarea',
    inputErrorMessage: '请输入备注',
  }).then(({ value }) => {
    let param = {
      businessId: state.formData.id as number,
      businessType: '1',
      id:state.examineRow.id,
      remark: value as string,
    };
    casualCheckRecordRejectReview(param).then((res) => {
     ElMessage.success('驳回审核成功');
     dialog.value.visible = false;
     emit('submitOk')
    });
  });
}
</script>

<template>
  <el-dialog :title="dialog.title" v-model="dialog.visible" width="1200px" destroy-on-close @close="cancel">
    <el-card>
      <el-form :model="form" :inline="true" label-width="120px" disabled>
        <el-form-item label="订单总额" prop="orderMoney">
          <el-input v-model="form.orderMoney" placeholder="请输入订单总额" clearable style="width: 179px" />
        </el-form-item>
        <!-- <el-form-item label="保险总额" prop="insureMoney">
          <el-input v-model="form.insureMoney" placeholder="请输入保险总额" clearable style="width: 179px" />
        </el-form-item>
        <el-form-item label="佣金总额" prop="commissionMoney">
          <el-input v-model="form.commissionMoney" placeholder="请输入佣金总额" clearable style="width: 179px" />
        </el-form-item> -->
        <el-form-item label="结算总额" prop="settlementMoney">
          <el-input v-model="form.settlementMoney" placeholder="请输入结算总额" clearable style="width: 179px" />
        </el-form-item>
        <el-form-item label="用工类型" prop="typeName">
          <el-input v-model="form.typeName" placeholder="请输入用工类型" clearable style="width: 179px" />
        </el-form-item>
        <el-form-item label="用工天数" prop="employmentDay">
          <el-input v-model="form.employmentDay" placeholder="请输入用工天数" clearable style="width: 179px" />
        </el-form-item>
        <el-form-item label="单人服务费用" prop="employmentDay">
          <el-input v-model="form.price" placeholder="请输入用工天数" clearable style="width: 179px" />
        </el-form-item>
        <el-form-item label="用工时间" prop="orderDate">
          <el-input v-model="form.orderDate" placeholder="请输入用工时间" clearable style="width: 300px" />
        </el-form-item>
      </el-form>
      <el-table ref="dataTableRef" v-loading="dataLoading" :data="dataList" highlight-current-row border height="400">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="名称" prop="engineerRealname" width="70" />
        <el-table-column label="提交时间" prop="createTime" width="160" />
        <el-table-column label="手机号" prop="phone" width="120" />
        <el-table-column label="用户身份证号码" prop="idcard" width="170" />
        <el-table-column label="用工人员银行卡号" prop="cardNo" width="170" />
        <el-table-column label="银行卡信息（开户行）" prop="cardAddress" width="170" />
        <el-table-column label="用工类别" prop="categoryName" width="70" />
        <el-table-column label="邀请人" prop="yqEngineerName" width="70" >
          <template #default="scope">
            <span class="yqEngineerName" @click.stop="selectPeople(scope.row)">{{scope.row.yqEngineerName?scope.row.yqEngineerName:'--'}}</span>
          </template>
        </el-table-column>
        <el-table-column label="邀请人佣金" prop="yqMoney" width="100" />
        <!-- <el-table-column label="个税" prop="personalIncomeTax" width="60" /> -->
        <el-table-column label="订单金额" prop="orderMoney" width="90" />
        <!-- <el-table-column label="保险金额" prop="insureMoney" width="90" />
        <el-table-column label="佣金金额" prop="commissionMoney" width="90" /> -->
        <el-table-column label="结算金额" prop="settlementMoney" width="100">
          <template #default="scope">
            <el-input type="number" v-model="scope.row.settlementMoney" placeholder="请输入结算金额" @input="handleChange" v-if="!ifexamine" />
            <span v-else>{{scope.row.settlementMoney}}</span>
          </template>
        </el-table-column>
        <el-table-column label="原因" prop="reason" min-width="100">
        </el-table-column>
      </el-table>

    </el-card>
    <template #footer>
      <div class="dialog-footer" v-if="!ifexamine">
        <el-button type="primary" v-if="selectRow.settlementStatus !== 1 && selectRow.settlementStatus !== 2" @click="submitForm(false)">保 存</el-button>
        <el-button type="primary" v-if="selectRow.settlementStatus !== 1 && selectRow.settlementStatus !== 2" @click="submitForm(true)">保存并提交审核</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
      <div class="dialog-footer" v-else-if="examineRow.isCheck == '0'">
        <el-button type="primary" @click="through">通 过</el-button>
        <el-button @click="reject">驳 回</el-button>
      </div>
    </template>
  </el-dialog>
  <selectEngineer ref="refEngineer" @submitOk="submitOk" />
</template>
<style>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
input[type='number'] {
  -moz-appearance: textfield;
}
.yqEngineerName{
  color: #409eff;
  cursor: pointer;
}
</style>
